// react 的根组件
import React, {Component} from "react";

// 使用模块化的方式导入图片
import zfb from '@/zfb.png'

import axios from 'axios'

export default class App extends Component {

    state = {
        list: []
    }

    componentDidMount(){
        // 生命周期
        // axios('http://open.douyucdn.cn/api/RoomApi/live').then(res => {
        //     console.log(res);
        // })
        axios('/api/RoomApi/live').then(res => {
            console.log(res);

            
            this.setState({
                list: res.data.data
            })
        })
    }

    render() {
        return (
            <div>
                <h1> 一节课不旷，一节课不听，主打的是就是陪伴 </h1>
                <h2>你好 老吴</h2>
                <img src={zfb} style={{ width: 100 }} alt="" />

                <ul>
                    {this.state.list.map(item => {
                        return (<li key={item.room_id}>{item.room_name}</li>)
                    })}
                </ul>
            </div>
        )
    }
}